﻿<%@ Control Language="C#" AutoEventWireup="true" CodeFile="Password.ascx.cs" Inherits="controls_Password" %>
<div class="row">
    <div class="col">
        <div class="row">
            <div class="col <%= TitleCssClass %>">Password</div>
            <div class="col <%= PasswordCssClass %>">
                <asp:TextBox ID="tbxPassword" runat="server" TextMode="Password" MaxLength="15" 
                    onkeyup="calculateStrength(this.value)" ></asp:TextBox>
            </div>
            <div class="col <%= PasswordErrorMessageCssClass %>">
                <asp:RegularExpressionValidator ID="revPasswordValidator" runat="server" Display="Dynamic" 
                    ErrorMessage="<%$ Code:CodeWork.Library.RegExUtil.PasswordFormatError %>" Text="*" 
                    ValidationExpression="<%$ Code:CodeWork.Library.RegExUtil.PasswordFormat %>"
                    ControlToValidate="tbxPassword" ></asp:RegularExpressionValidator>
            </div>
            <div class="col">
                <asp:CustomValidator ID="cuvPassword" runat="server" OnServerValidate="validatePasswordStrength"
                    Display="Dynamic" ControlToValidate="tbxPassword" Text="*"
                    ErrorMessage="Password is poor, try a better one" >
                </asp:CustomValidator>
            </div>
            <div class="col">
                <asp:RequiredFieldValidator ID="rqvPassword" runat="server" ControlToValidate="tbxPassword"
                    Display="dynamic" ErrorMessage="Password is required" Text="*" >
                </asp:RequiredFieldValidator>
            </div>
            <div id="strengthIndicator" class="col <%= PasswordStrengthCssClass %>">
                <asp:Label ID="lblStrength" runat="server" Text=""></asp:Label>
            </div>
            <div class="col <%= PasswordHintCssClass %>">
                &nbsp;<a href="#" onmouseover="TagToTip('passwordHint')" onmouseout="UnTip()" >Get password help</a>&nbsp;
            </div>
        </div>
        <div class="row">
            <div class="col <%= TitleCssClass %>">Re-type Password</div>
            <div class="col <%= PasswordCompareCssClass %>">
                <asp:TextBox ID="tbxConfirmPassword" runat="server" TextMode="Password" 
                    MaxLength="15"></asp:TextBox>
            </div>
            <div class="col <%= PasswordCompareErrorMessageCssClass %>">
                <asp:CompareValidator ID="cmvComparePassword" runat="server" Display="Dynamic"
                    ErrorMessage="Passwords do not match" ControlToValidate="tbxPassword" Text="*" 
                    ControlToCompare="tbxConfirmPassword" ></asp:CompareValidator>
            </div>
        </div>
    </div>
</div>

<div id="passwordHint" style="visibility:hidden;width:0px;height:0px;">
    Allowed characters: upper case letter,<br />
    lower case letter, digits and any of <br />
    the following special characters:<br />
    ~!@#$%^&*_|?<br />
    <br />
    use one of the each kind to increase <br />
    password strength.<br />
</div>

<script src="../javascripts/prototype.js" type="text/javascript"></script>
<script src="../javascripts/ApplicationCommon.js" type="text/javascript"></script>
<script src="../javascripts/wz_tooltip.js" type="text/javascript"></script>
<script type="text/javascript">
    function calculateStrength(password)
    {
       var label = $('<%=lblStrength.ClientID %>');
       
       if(password == "")
       {
           label.innerHTML = "";
           $('strengthIndicator').style.backgroundColor = "#ffffff";
           return true;;
       }
       
       var strength = 0;
       
       var brokenPassword = password.toArray();
       var frequencyCount = new Array(257);
       
       for(var t=0;t<257;t++)
            frequencyCount[t]= 0;
            
       var symbolTypeCount = 0;
       var lowerTypeCount = 0;
       var upperTypeCount = 0;
       var numberTypeCount = 0;
       var typeCount = 0;
       var symbols = "~!@#$%^&*_|?";
       
       for(var i =0;i<brokenPassword.length;i++)
       {
            var value = ascii_value(brokenPassword[i]);
            if(value<256)
                frequencyCount[value]++;
            else
                frequencyCount[256]++;
                
            if(value >= ascii_value('a') && value <= ascii_value('z'))
                lowerTypeCount++;
            else if(value >= ascii_value('A') && value <=ascii_value('Z'))
                upperTypeCount++;
            else if(value >= ascii_value('0') && value <=ascii_value('9'))
                numberTypeCount++;
            else if(symbols.indexOf(brokenPassword[i])>=0)
                symbolTypeCount++;            
       }
       
       if(symbolTypeCount>0)
           typeCount++;
       if(numberTypeCount>0)
           typeCount++;
       if(lowerTypeCount>0)
           typeCount++;
       if(upperTypeCount>0)
           typeCount++;
           
       var uniqueCount =0;
       for(var j=0;j<257;j++)
            if(frequencyCount[j]>0)
                uniqueCount++;
    
       strength = uniqueCount * typeCount;
       
       if(strength >40)
       {
            label.innerHTML = "Very Strong";
            $('strengthIndicator').style.backgroundColor = "#108f34";
       }
       else if(strength > 30)
       {
            label.innerHTML = "Strong";
            $('strengthIndicator').style.backgroundColor = "#28cc02";
       }
       else if(strength > 20)
       {
            label.innerHTML = "Weak";
            $('strengthIndicator').style.backgroundColor = "orange";
       }
       else if(strength > 10)
       {
            label.innerHTML = "Very Weak";
            $('strengthIndicator').style.backgroundColor = "yellow";
       }
       else
       {
            label.innerHTML = "Poor";
            $('strengthIndicator').style.backgroundColor = "red";
       }
    }
</script>